<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>

    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="css/sass.css">
    <link rel="stylesheet" href="font/iconfont.css">
    <script>
        if (localStorage.getItem("token") !== "ok") {
            if (confirm("还未登录，是否去登录")) {
                location.href = "./denglu.html"
            } else {
                history.back()
            }



        }
    </script>
</head>

<body>
    <!-- icon图标使用方法cb
     <h1 class="iconfont">&#xe602;</h1> -->

    <div class="headd">
        <div class="banzhong">
            <div class="headdl">
                <a href="" class="iconfont sj"
                    style="width: 108px;height: 29.6px;font-size: 12px;margin-top: 2px; ">&#xe694;手机版</a>
                <i>丨</i>
                <a href="" class="sj" style="width: 108px;height: 29.6px;font-size: 12px;">Q币充值</a>
            </div>
            <div class="headdr">
                <div class="opop">
                    <div href="" class="headdr1" id="headdr1"
                        style="width: 108px;height: 29.6px;font-size: 12px; line-height: 29.6px;display: block;">
                        <span>你还未登录请</span> <a href="denglu.html" style="color: #666;">登录</a> </div>
                    <div href="" class="headdr1" id="headdr2"
                        style="width: 108px;height: 29.6px;font-size: 12px; line-height: 29.6px;display: none;"><span
                            style="float: left; display: block;height: 29px; width: 70px;white-space:nowrap;overflow: hidden;text-overflow : ellipsis;">欢迎1768232483</span><em
                            class="tcgn" style="color: #666;float: left;margin-left: 10px;">退出</em> </div>
                    <i>丨</i>
                    <a href="" class="sj" style="width: 108px;height: 29.6px;font-size: 12px;">我的订单</a>
                    <i>丨</i>
                    <a href="" class="iconfont sj" style="width: 108px;height: 29.6px;font-size: 12px;">个人中心</a>
                    <i>丨</i>
                    <a href="" class="sj" style="width: 108px;height: 29.6px;font-size: 12px;">帮助中心</a>
                    <i>丨</i>
                    <a href="" class="sj" style="width: 108px;height: 29.6px;font-size: 12px;">游戏导航</a>
                </div>

            </div>
        </div>
    </div>

    <div class="head">
        <div class="headbz">
            <img src="images/hlogo_03.png" alt="" class="headpl">
            <div class="ssbj">
                <div class="ssk">
                    <div class="sskl">
                        <div class="sskxl">选择游戏</div>
                        <div class="sskbj">

                            <input type="text" placeholder="请选择游戏搜索道具" class="ss">
                        </div>

                    </div>
                    <div class="ssan iconfont">&#xe605;</div>
                </div>

            </div>
            <img src="images/hr.png" alt="" class="headpr">
        </div>

    </div>

    <div class="nav">
        <div class="navbz">
            <div class="navl iconfont">&#xe623;
                所有游戏分类</div>
            <a href="daojucheng.html">首页</a>
            <a href="">活动中心</a>
            <a href="">聚诚品</a>
            <a href="">手游中心</a>

            <a href="">聚豆商城</a>

            <a href=""
                style="height: 51px; background-color: #f74a4a;border-bottom: 3px solid rgba(255, 0, 0, 1); ">个人中心</a>
            <div class="navr">
                <div class="iconfont  kkk">
                    <div><span> &#xeab2;购物车 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>
                        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;0</div>
                </div>
            </div>


        </div>
    </div>
    <!-- 大背景 -->
    <div class="dbj">
        <div class="dbj1">
            <div>道聚城>个人中心</div>
        </div>

        <div class="khz">

            <div class="khzl">
                <ul>
                    <li><a href="" class="iconfont"><span style="font-size: 20px;">&#xe6ae;</span> &nbsp; 个人中心首页</a>
                    </li>
                    <li><a href="" class="iconfont"><span style="font-size: 20px;">&#xe6ae;</span> &nbsp; 我的特权</a></li>
                    <li><a href="" class="iconfont"><span style="font-size: 20px;">&#xe6ae;</span> &nbsp; 我的任务</a></li>
                    <li><a href="" class="iconfont"><span style="font-size: 20px;">&#xe6ae;</span> &nbsp; 我的订单</a></li>
                    <li><a href="" class="iconfont"><span style="font-size: 20px;">&#xe6ae;</span> &nbsp; 我的道聚城白条</a>
                    </li>
                    <li><a href="" class="iconfont"><span style="font-size: 20px;">&#xe6ae;</span> &nbsp; 道聚城会员体验卡</a>
                    </li>
                    <li><a href="" class="iconfont"><span style="font-size: 20px;">&#xe6ae;</span> &nbsp; 我的周边订单</a>
                    </li>
                    <li><a href="" class="iconfont"><span style="font-size: 20px;">&#xe6ae;</span> &nbsp; 我的收货地址</a>
                    </li>
                    <li><a href="" class="iconfont"><span style="font-size: 20px;">&#xe6ae;</span> &nbsp; 我的购物点</a></li>
                    <li><a href="" class="iconfont"><span style="font-size: 20px;">&#xe6ae;</span> &nbsp; 我的优惠劵</a></li>
                    <li><a href="" class="iconfont"><span style="font-size: 20px;">&#xe6ae;</span> &nbsp; 我的聚豆</a></li>
                    <li><a href="" class="iconfont"><span style="font-size: 20px;">&#xe6ae;</span> &nbsp; 我的消息</a></li>
                    <li><a href="" class="iconfont"><span style="font-size: 20px;">&#xe6ae;</span> &nbsp; 我的关注</a></li>
                    <li><a href="" class="iconfont"><span style="font-size: 20px;">&#xe6ae;</span> &nbsp; 我的功能性道具</a>
                    </li>
                    <li><a href="" class="iconfont"><span style="font-size: 20px;">&#xe6ae;</span> &nbsp; 领取魅力值</a></li>
                    <li><a href="" class="iconfont"><span style="font-size: 20px;">&#xe6ae;</span> &nbsp; 我的道具</a></li>
                </ul>

            </div>

            <div class="khzr">
                <div class="llll">
                    <div class="lls" style="border: none;">
                        <img src="images/jax1.jpg" alt="" class="llsi">
                        <div class="llsxx">
                            <span> <i style="color: rgba(255, 0, 0, 1);"> 1768232483</i>(转个圈还在远点)</span>
                            <span style="color: #666; font-size: 14px;">非心悦会员</span>
                            <span class="iconfont" style="color: #666; font-size: 14px;">&#xe694;未绑定</span>
                        </div>
                        <div id="llsrr">
                            <div style="width: 552px;height: 20px; border: none;">
                                <span>成长值 </span>
                                <span style="color: rgba(255, 0, 0, 1);"> &nbsp; 2481</span>
                                <span style="margin-left: 190px;">距离升级还需 </span>
                                <span style="color: rgba(255, 0, 0, 1);">&nbsp; 47519</span>
                                <span>&nbsp; 成长值</span>
                            </div>

                            <div id="load">

                            </div>
                            <div id="loadx"> <span>非会员</span>
                                <span style="margin-left: 25px;">【10000-49999】</span>
                                <span style="margin-left: 10px;">心悦VIP1</span>

                                <span style="margin-left: 120px;">心悦VIP2</span>
                                <span style="margin-left: 120px;"> 心悦VIP3</span></div>
                        </div>

                    </div>
                    <div class="llx" style="background-color: #e6e9ef; border: none;">
                        <p style="margin-left: 20px;font-size: 10px;line-height: 50px;">
                            <span>个人账户：</span>
                            <span class="iconfont" style="margin-left: 30px;">&#xe602;0</span>
                        </p>
                    </div>
                </div>
            </div>

            <div class="xf">
                <div class="xfl">
                    <p class="xflt">最近登录的游戏</p>
                    <ul>
                        <li><img src="images/xx1.jpg">
                            <span
                                style="text-align: center;font-size: 12px;color: #3a3f4a;width: 50px;display: block; ">寻仙</span>
                        </li>
                        <li><img src="images/xx2.jpg">
                            <span
                                style="text-align: center;font-size: 12px;color: #3a3f4a;width: 50px;display: block; ">英雄联盟</span>
                        </li>
                        <li><img src="images/xx3.jpg">
                            <span
                                style="text-align: center;font-size: 12px;color: #3a3f4a;width: 50px;display: block; ">穿越火线</span>
                        </li>
                        <li><img src="images/xx4.jpg">
                            <span
                                style="text-align: center;font-size: 12px;color: #3a3f4a;width: 50px;display: block; ">地下城与勇士</span>
                        </li>
                    </ul>

                </div>
                <div class="xfr">
                    <p class="xflt">本月累计消费</p>
                    <div style="width: 627px;border-bottom:  1px solid #e6e9ef;">
                        <div class="xfltll">
                            <div style="margin-left: 50px;">
                                <h2>本月消费总金额(元)</h2>
                                <h3>0</h2>
                            </div>
                            <div>
                                <h2>本月成功订单数(笔)</h2>
                                <h3>0</h2>
                            </div>
                            <div>
                                <h2>本月消费排名</h2>
                                <h3 style="font-size: 12px;color: #333;">暂无排名</h2>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="sq" style="    padding-left: 15px;
                  color: #333;
                  font-size: 14px;line-height: 44px;">
                本月道聚城为你省了：<span style="    color: #f74a4a;
                      font-size: 18px;line-height: 44px;">0 Q币</span>
            </div>
            <div class="tq">
                <div>
                    <div>
                        <span style="display: block;line-height:25px ;font-size: 14px;color: #3a3f4a;">我的特权
                        </span>
                        <i id="iii"></i>
                    </div>
                    <h4 class="tqlo">
                        <span class="tqlox" style="border-left: #e6e9ef 1px solid">
                            <i class="tqi"></i>
                            <span class="tqix">专享优惠劵</span>
                        </span>
                        <span class="tqlox">
                            <i class="tqi" style="background-position: -358px -155px;"></i>
                            <span class="tqix">首次消费礼</span>
                        </span>
                        <span class="tqlox">
                            <i class="tqi" style="background-position: -585px -156px;"></i>
                            <span class="tqix">道具逢十礼</span>
                        </span>
                        <span class="tqlox">
                            <i class="tqi" style="background-position: -812px -154px;"></i>
                            <span class="tqix">消费成长礼</span>
                        </span>

                    </h4>
                </div>

            </div>



            <div class="tq">
                <div>
                    <div>
                        <span style="display: block;line-height:25px ;font-size: 14px;color: #3a3f4a;">我的特权
                        </span>
                        <i id="iii"></i>
                    </div>
                    <h4 class="tqlo" style="display: flex;flex-wrap: nowrap;width: 105px;height: 110px;">
                        <span class="tqlox" style="border: none">
                            <i class="tqi"
                                style="width: 105px;height: 110px;background-position: -135px -379px;margin-left: 60px;margin-top: 5px;"></i>
                            <span class="tqix" style="margin-left: 28px;">每日签到</span>
                        </span>
                        <span class="tqlox" style="border: none">
                            <i class="tqi"
                                style=" background-position: -316px -379px;;width: 105px;height: 110px;margin-left: 60px;margin-top: 5px;"></i>
                            <span class="tqix" style="margin-left: 28px;">完善资料</span>
                        </span>
                        <span class="tqlox" style="border: none">
                            <i class="tqi"
                                style="    background-position: -500px -379px;width: 105px;height: 110px;margin-left: 60px;margin-top: 5px;"></i>
                            <span class="tqix" style="margin-left: 28px;">下载APP</span>
                        </span>
                        <span class="tqlox" style="border: none">
                            <i class="tqi"
                                style="    background-position: -679px -379px;width: 105px;height: 110px;margin-left: 60px;margin-top: 5px;"></i>
                            <span class="tqix" style="margin-left: 32px;">每日登录APP</span>
                        </span>
                        <span class="tqlox" style="border: none">
                            <i class="tqi"
                                style="    background-position: -863px -379px;width: 105px;height: 110px;margin-left: 60px;margin-top: 5px;"></i>
                            <span class="tqix" style="margin-left: 32px;">APP首次消费</span>
                        </span>

                    </h4>
                </div>
            </div>

            <div class="sorry">
                <div class="sobz">
                    <img src="images/images/xiaoren.png" alt=""
                        style="width: 100px;height: 100px;display: block;float: left;">
                    <div style="width: 430px;height: 82px;float: left;">
                        <p style="font-weight: 700;
                               font-size: 14px;
                               color: #333;
                               padding-bottom: 10px;margin-top: 10px;">抱歉，暂无任何订单信息！</p>
                        <p style="font-size: 12px;color: #666;margin-top: 15px;">你可以：</p>
                        <p style="font-size: 12px;color: #666;margin-top: 5px;">1、进入道聚城首页更多折扣道具等着你，<a href=""> 立即前往></a>
                        </p>
                    </div>
                </div>
            </div>
        </div>
    </div>



    <!-- foot -->
    <div style="height: 331px;background-color: #3b3f4a; margin-top: 40px;padding-top: 25px;">
        <div style="width: 1250px;height: 150px;margin: 0 auto;margin-top: 25px;">
            <div style="width: 227px;height: 150px;border-right: 1px solid #444853;float: left;">
                <h5 style="width: 227px;margin-left: 55px;font-size: 15px;height: 30px;color: #acb1bb;"> <span
                        class="iconfont" style=" width: 227px; font-size: 20px;text-align: center;">&#xe6c5;</span> 我是新手
                </h5>
                <h4 style="width: 227px;height: 25px;font-size: 12px;margin-left: 80px;color: #acb1bb;">什么是道聚城</h4>
                <h4 style="width: 227px;height: 25px;font-size: 12px;margin-left: 80px;color: #acb1bb;">如何购买</h4>
                <h4 style="width: 227px;height: 25px;font-size: 12px;margin-left: 80px;color: #acb1bb;">如何赠送</h4>
                <h4 style="width: 227px;height: 25px;font-size: 12px;margin-left: 80px;color: #acb1bb;">如何获取聚豆</h4>
            </div>
            <div style="width: 227px;height: 150px;border-right: 1px solid #444853;float: left;">
                <h5 style="width: 227px;margin-left: 55px;font-size: 15px;height: 30px;color: #acb1bb;"> <span
                        class="iconfont" style=" width: 227px; font-size: 20px;text-align: center;">&#xe6c5;</span> 个人中心
                </h5>
                <h4 style="width: 227px;height: 25px;font-size: 12px;margin-left: 80px;color: #acb1bb;">发货时间</h4>
                <h4 style="width: 227px;height: 25px;font-size: 12px;margin-left: 80px;color: #acb1bb;">如何领取</h4>
                <h4 style="width: 227px;height: 25px;font-size: 12px;margin-left: 80px;color: #acb1bb;">补发规则</h4>
                <h4 style="width: 227px;height: 25px;font-size: 12px;margin-left: 80px;color: #acb1bb;">vip定价</h4>
                <h4 style="width: 227px;height: 25px;font-size: 12px;margin-left: 80px;color: #acb1bb;">道具状态定义</h4>
            </div>
            <div style="width: 227px;height: 150px;border-right: 1px solid #444853;float: left;">
                <h5 style="width: 227px;margin-left: 55px;font-size: 15px;height: 30px;color: #acb1bb;"> <span
                        class="iconfont" style=" width: 227px; font-size: 20px;text-align: center;">&#xe6c5;</span> 支付方式
                </h5>
                <h4 style="width: 227px;height: 25px;font-size: 12px;margin-left: 80px;color: #acb1bb;">支付方式</h4>
                <h4 style="width: 227px;height: 25px;font-size: 12px;margin-left: 80px;color: #acb1bb;">购物点支付</h4>
                <h4 style="width: 227px;height: 25px;font-size: 12px;margin-left: 80px;color: #acb1bb;">如何充值</h4>

            </div>
            <div style="width: 227px;height: 150px;border-right: 1px solid #444853;float: left;">
                <h5 style="width: 227px;margin-left: 55px;font-size: 15px;height: 30px;color: #acb1bb;"> <span
                        class="iconfont" style=" width: 227px; font-size: 20px;text-align: center;">&#xe6c5;</span>
                    腾讯在线服务</h5>
                <h4 style="width: 227px;height: 25px;font-size: 12px;margin-left: 80px;color: #acb1bb;">腾讯官方在线客服</h4>
                <img src="images/gongshang.png" alt=""
                    style="width: 119px;height: 49px;display: block;margin: 10px auto;">
            </div>
            <div style="float: left;">
                <div style="width: 240px;height: 135px;margin: 0 auto;">
                    <div style="width: 100px; height: 135px;float: left; ">
                        <img src="images/iii1.png" alt="" style="width: 100px;">
                        <h5
                            style="width: 100px ;height: 12px;margin-top: 20px; color: #a4abb4;font-size: 12px;text-align: center;">
                            掌上道聚城</h5>
                    </div>
                    <div style="width: 100px; height: 135px;float: right;">
                        <img src="images/iiii2.png" alt="" style="width: 100px;">
                        <h5
                            style="width: 100px ;height: 12px;margin-top: 20px;color: #a4abb4;font-size: 12px;text-align: center;">
                            道聚城公众号</h5>
                    </div>
                </div>

            </div>

        </div>

        <div style="margin: 0 auto;width:1250px ;height: 145px;border-top: 1px solid #444853;">
            <span
                style="display: block;width: 1000px;margin: 0 auto;text-align: center;color: #81858f;font-size: 12px;margin-top: 40px;">腾讯互动娱乐
                | 服务条款| 腾讯游戏隐私保护指引| 腾讯游戏儿童隐私保护指引| 广告服务 | 腾讯游戏招聘 | 腾讯游戏客服 | 游戏地图 | 成长守护平台 | 商务合作 | 网站导航</span>
            <span
                style="display: block;width: 1000px;margin: 0 auto;text-align: center;color: #81858f;font-size: 12px;">COPYRIGHT
                © 1998 – 2020 TENCENT. ALL RIGHTS RESERVED.</span>
            <span
                style="display: block;width: 1000px;margin: 0 auto;text-align: center;color: #81858f;font-size: 12px;">腾讯公司
                版权所有</span>
        </div>
    </div>



</body>
<script src="./libs/jquery.js"></script>
<script>
    $(".qudl").click(function () {
        localStorage.setItem("dl", "1")
    });
    //  首页的登录守卫
    if (localStorage.getItem("token") === "ok") {
        $("#headdr1").css("display", "none");

        $("#headdr2").css("display", "block")
            .children("span").html("欢迎" + localStorage.getItem("un"));
        // console.log("66");
    }

    // 退出功能
    $(".tcgn").click(function () {
        location.href = "./gouwuche.html"
        console.log("88");
        localStorage.setItem("token", "");
        $("#headdr1").css("display", "block");

        $("#headdr2").css("display", "none");
    })
</script>

</html>